<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:p="http://primefaces.org/ui">
<head>
<title>Market place</title>

</head>

<body>
	<ui:composition template="/templates/masterTemplate.xhtml">
		<ui:define name="content">
			<f:event listener="#{passwordRecoverController.init}"
				type="preRenderComponent"></f:event>
			<h:outputStylesheet library="css" name="login.css"></h:outputStylesheet>
			<div id="center">
				<div id="loginInfo">
					<h:outputText value="#{msgs.gettingBackPassword}." style="color:orange"></h:outputText>
					<p:separator></p:separator>
					<h:form id="centerForm">
						<h:panelGrid id="passwordRecoverPanel" columns="1">
							<h:panelGrid id="emailPanel" columns="1" style="width:100%;">
								<h:outputText value="#{msgs.email}:"></h:outputText>
								<h:panelGrid columns="2">
									<p:inputText value="#{passwordRecoverController.email}">
										<p:ajax event="focus"
											update=":centerForm:emailMessage,:centerForm:passwordAnswerPanel"
											listener="#{passwordRecoverController.startInputingEmail}"></p:ajax>
									</p:inputText>
									<p:commandButton value="#{msgs.getQuestion}"
										actionListener="#{passwordRecoverController.checkEmail}"
										ajax="true" update=":centerForm:passwordRecoverPanel"
										style="font-size:0.7em" />
								</h:panelGrid>
								<h:panelGrid id="emailMessage">
									<h:outputText value="#{msgs.emailNotExist}."
										rendered="#{passwordRecoverController.isEmailIncorrect}" />
								</h:panelGrid>
							</h:panelGrid>
							<h:panelGrid id="passwordAnswerPanel">
								<h:panelGrid columns="1" style="width:100%"
									rendered="#{passwordRecoverController.isEmailCorrect}">
									<h:outputText
										value="#{passwordRecoverController.passwordQuestion}" />
									<h:panelGrid columns="2">
										<p:inputText
											value="#{passwordRecoverController.passwordAnswer}">
											<p:ajax event="focus"
												update=":centerForm:passwordAnswerMessagePanel"
												listener="#{passwordRecoverController.startInputingPasswordAnswer}">
											</p:ajax>
										</p:inputText>
										<p:commandButton value="#{msgs.getPassword}" ajax="true"
											update=":centerForm:passwordRecoverPanel"
											actionListener="#{passwordRecoverController.checkPasswordAnswer}"
											style="float:right;font-size:0.7em">
										</p:commandButton>
									</h:panelGrid>
									<h:panelGrid id="passwordAnswerMessagePanel">
										<h:outputText value="#{msgs.weHaveSendYouPassword}."
											style="font-size:1.2em, color:blue"
											rendered="#{passwordRecoverController.isPasswordAnswerCorrect}"></h:outputText>
										<h:outputText value="#{msgs.passwordAnswerIncorrect}."
											style="font-size:1.2em, color:blue"
											rendered="#{passwordRecoverController.isPasswordAnswerIncorrect}"></h:outputText>
									</h:panelGrid>
								</h:panelGrid>
							</h:panelGrid>
						</h:panelGrid>
					</h:form>
				</div>
			</div>
		</ui:define>
	</ui:composition>
</body>

</html>